<template>
  <el-card class="box-card">
    <template #header>
      <myheader :required="required" :validator="validator" :title="title" />
    </template>
    <div>
      <el-input
        v-model="value"
        type="textarea"
        :rows="4"
        placeholder="Please input"
        clearable
        @change="valChange"
      />
    </div>
  </el-card>
</template>

<script>
import myheader from "./header.vue";
import { ElCard, ElInput } from "element-plus";
export default {
  components: { ElCard, ElInput, myheader },
  props: {
    title: {
      type: String,
      required: true,
    },
    value: {
      type: String,
      default: "",
    },
    required: {
      type: Boolean,
      default: false,
    },
    validator: {
      type: Boolean,
      default: true,
    },
  },
  setup(props, context) {
    const { emit } = context;
    const valChange = (val) => {
      emit("select", val);
    };
    return { valChange };
  },
};
</script>

<style>
</style>